/*
	本地音乐播放器
	在pf类库基础上开发
	功能：
	1、实现拖拽选择任意多音乐
	2、播放器界面自定义
	3、实现播放、暂停、停止、上一曲、下一曲、音量大小、播放进度等功能
	4、对客户端浏览器进行能力检测，是否支持audio标签，不支持给予提示
	5、对浏览器进行音频支持格式检测，给予提示
	6、读取MP3音频的ID3数据，借助ID3V2类库，暂不支持

*/

var SugarAudioPlayer = function(tips) {
	/*
		queue: 播放队列 []
		current: 当前曲目
	*/
	this.tips = $I(tips); // 获取提示框
	this.cover = null;
	this.drop = null;
	this.queue = [];
	this.init();

};

SugarAudioPlayer.prototype = {
	constructor: SugarAudioPlayer,
	
	// 检测是否支持，不支持，给予提示
	// 初始化播放器
	// 如果存在本地数据，则显示播放器跟播放列表
	// 如果不存在，则弹出浮层，提示用户拖动音频文件进来
	init: function() {
		if ( this.canPlay() ) {
			
			if ( localStorage && localStorage.sugarAudioList ) {
				this.queue = localStorage.sugarAudioList.split(',');
			} else {
				
				this.createDrop();	
			}
			
			
			
			
			
		} else {
			this.tips.innerHTML = "亲，浏览器不给力哇~";
		}
	
	
	},
	
	
	// 能力检测
	canPlay: function() {
		var audio = document.createElement('audio');
		return !!audio.canPlayType;
	},
	
	// 音频格式检测
	canPlayFormat: function(type) {
		var audio = document.createElement('audio');
		return !!(this.canPlay && audio.canPlayType(type).replace(/no/, ''));
	},
	
	// 文件过滤，剔除非mp3或ogg格式文件	
	filter: function(file) {
		if ( /audio\/\w+/.test( file.type ) ) {
			this.queue.push(file);
			console.log(file);
			//alert(this.queue[0].join());
		}
	},
	
	// 浮层 拖拽
	createDrop: function() {
		if ( !this.cover ) {
			this.cover = document.createElement('div');
			$_setAttr(this.cover, 'class', 'cover');
					
			// 拖拽浮层
			this.drop = document.createElement('div');
			$_setAttr(this.drop, 'id', 'dropArea');
			$_setAttr(this.drop, 'class', 'drop');
			this.drop.innerHTML  = '亲，拖到这里吧';
					
			document.body.appendChild(this.cover);
			document.body.appendChild(this.drop);
	
		} else {
			$_setStyle(this.cover, 'display', 'block');
		}
		
		var drop = this.drop,
			self = this;
		$_addHandler(drop, "dragenter", function(e) {
			pf.event.preventDefault(e);
			pf.event.stopPropagation(e);
			$_setStyle(drop, "border-style", "dashed");
		});	
					
		$_addHandler(drop, "dragleave", function(e) {
			pf.event.preventDefault(e);
			pf.event.stopPropagation(e);
			$_setStyle(drop, "border-style", "solid");
		});
					
		$_addHandler(drop, "dragover", function(e) {
			pf.event.preventDefault(e);
			pf.event.stopPropagation(e);
			$_setStyle(drop, "border-style", "dashed");
		});
					
		$_addHandler(drop, "drop", function(e) {
			pf.event.preventDefault(e);
			pf.event.stopPropagation(e);
			$_setStyle(drop, "border-style", "solid");
			
			var fileList = e.dataTransfer.files;
			for (var i = 0, j = fileList.length; i < j; i++) {
				var file = fileList[i];	
				self.filter( file );
			}
			if ( self.queue.length > 0 ) {
			
				var audio = self.createAudio();
				
				
				var url;
				if ( window.createObjectURL ) {
					url = window.createObjectURL( self.queue[0] );
				}
				if ( window.createBlobURL ) {
					url = window.createBlobURL( self.queue[0] );
				}
				if ( window.URL && window.URL.createObjectURL ) {
					url = window.URL.createObjectURL( self.queue[0] );
				}
				
				if ( window.webkitURL && window.webkitURL.createObjectURL ) {
					url = window.webkitURL.createObjectURL( self.queue[0] );
				}
				
				if ( url ) {
					$_setStyle(self.cover, 'display', 'none');
					$_setStyle(drop, 'display', 'none');
					
					var interFace = self.interFace();
					
					audio.src = url;
					audio.play();
				
				}
				
				
				
			
			}
		});
		
	
	},
	
	// 播放器界面
	interFace: function() {
		var playWrap = document.createElement('div');
		$_setAttr(playWrap, 'class', 'player_wrap');
		
		playWrap.innerHTML = '<div id="interface" class="inter_face"><ul><li><a href="#" class="player_control prev">Prev</a></li><li><a href="#" class="player_control play">Play</a></li><li><a href="#" class="player_control pause" style="display:none;">Pause</a></li><li><a href="#" class="player_control next">Next</a></li><li><a href="#" class="player_control stop">Stop</a></li><li class="progress_wrap"><div class="progress"><div class="load_bar" style="width:100%;"></div><div class="play_bar" style="width:10%;"></div></div><div class="time"><span class="play_time">00:00</span><span class="total_time">00:00</span></div></li><li class="volume_wrap"><a id="setVolumeMin" href="#" class="volume_min">Min</a><div class="volume_bar"><div id="volumeValue" class="volume_value"></div></div><a id="setVolumeMax" href="#" class="volume_max">Max</a></li></ul></div>';
		
		document.body.appendChild(playWrap);
	
	},
	
	
	// audio创建 返回audio对象
	createAudio: function() {
		var audio = document.createElement('audio');
		document.body.appendChild(audio);
		return audio;
	},
	
	// 下一曲
	next: function() {
	
	
	},
	
	// 上一曲
	prev: function() {
	
	
	},
	
	// 播放列表本地化存储
	localStorage: function() {
	
	
	}
	
	
	
	


};








